<template>
  <div class="notice-dialog">
    <el-dialog :title="titleFlag ? '修改公告': '添加公告'" :visible.sync="show"
    :before-close="close">
      <el-form :model="addForm" ref="addForm" label-width="100px" class="demo-ruleForm">
  <el-form-item label="账号" prop="username">
    <el-input v-model="addForm.username"></el-input>
  </el-form-item>
  
  <el-form-item label="密码" prop="pass">
    <el-input v-model="addForm.pass"></el-input>
  </el-form-item>
  <el-form-item label="确认密码" prop="pass">
    <el-input v-model="addForm.pass"></el-input>
  </el-form-item>
  <el-form-item label="姓名" prop="name">
    <el-input v-model="addForm.name"></el-input>
  </el-form-item>
  <el-form-item label="联系方式" prop="tel">
    <el-input v-model="addForm.tel"></el-input>
  </el-form-item>
<el-form-item label="角色" prop="typeid">
   <el-select
                v-model="addForm.role"
                placeholder="请选择"
                multiple
                class="select"
              >
                <el-option
                  v-for="item in administratorrolelist"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                >
                </el-option>
              </el-select>
  </el-form-item>
</el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="addNotice"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import http from './../api/admin'
export default {
    props: {
        titleFlag: {
            type: Boolean,
            default: false
        },
        show: {
            type: Boolean,
            default: false
        },
        updateData: {
            type: Object,
            default: () => {}
        }
    },
    data () {
        return {
          administratorrolelist:[],
          list:[],
            addForm: {
                id: 0,
                username:"",
                pass: "",
                name: "",
                tel: "",
                typeid: 2
            }
        }
    },
    methods: {
        close() {
            this.$emit('close', false)
        },
        // 富文本编辑器
       async addNotice() {
            console.log('需要更新的数据', this.addForm)
            let msg = !this.addForm.id ? '添加成功' : '修改成功' 
            const {errCode } = await http.adminadd(this.addForm)
            if(errCode === 10000) {
                this.$message.success(msg)
                // 关闭弹出层 渲染公告列表
                this.$emit('close', false, undefined, 1)
                // 表单重置
                this.$refs.addForm.resetFields()
            }
        },
        async administratorroleslist() {
           const { data } = await http.administratorrolelist()
           this.tableData = data.list
          },
    },
    
    watch: {
        updateData (newVal) {
            if (newVal) {
                this.addForm = newVal
            }
        }
    },
    mounted() {
      this.administratorroleslist()
  },
};
</script>

<style lang="less" scoped>
</style>